<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Role_Add_Page</title>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.0.js"></script>
<script type="text/javascript">
	//角色名验证标识
	var flag = false;
	var initialValue;
	function check_rn(){
		var rolename = document.getElementById('tblRole.roleName');
		if(initialValue==rolename.value||rolename.value==''){
			//目标值未改变or目标值为空
			return false;
		}else{
			$.ajax({
				type:'post',
				url:'roleName_IValidatable',
				data:'roleName='+rolename.value,
				success:function(data){
					var msg = data.roleName_IValidatable_msg;
					if(msg!=undefined&&msg==1){
						document.getElementById('roleName_prompt').innerHTML="*";
						flag = true;
					}else{
						document.getElementById('roleName_prompt').innerHTML="角色名已经存在！";
					}
					initialValue=rolename.value;
				},
				error:function(){
					document.getElementById('roleName_prompt').innerHTML="数据验证失败，请联系管理员。";
				}
			});
		}
	}
	function role_clear(){
		document.getElementById('tblRole.roleName').value="";
		document.getElementById('tblRole.roleAbstract').value="";
	}

	function role_add(){
		var rb = document.getElementById('tblRole.roleAbstract');
		var roleForm = document.getElementById('roleForm');
		if(flag&&rb.value!=""){
			roleForm.submit();
		}else{
			alert("请正确填写名称和简介！");
		}
	}
	
</script>
</head>
<body>
	<form id="roleForm" action="role_do_add" method="post">
		<div>
			<label>名称：</label>
			<input type="text" id="tblRole.roleName" name="tblRole.roleName" onblur="check_rn();"/>
			<span style="color:red;" id="roleName_prompt">*</span>
		</div>
		<div>
			<label>简介：</label>
			<input type="text" id="tblRole.roleAbstract" name="tblRole.roleAbstract" />
			<span style="color:red;" id="roleAbstract_prompt">*</span>
		</div>
		<div>
			<input type="button" value="提交" onclick="role_add();"/>
			<input type="button" value="清除数据" onclick="role_clear();"/>
		</div>
	</form>
</body>
</html>